<template>
    <div>
        <el-form :model="ruleForm" ref="ruleForm" :rules="rules" :label-position="labelPosition" label-width="150px" class="demo-ruleForm">
  
            <div class="container"  style="margin-top:20px">
                <h3 style="margin-bottom: 20px">产销对接</h3>

                <el-row>
                    <el-col :span="12">
                        <el-form-item label="产品标题：" prop="title">
							{{ruleForm.title}}
                        </el-form-item>
                        
                        
                        <el-form-item label="产品图片：" prop="img" style="width:500px">
							<img :src="img" alt="" style="width:200px; height:200px;">
                        </el-form-item>
                    </el-col>
                    <el-col :span ="10">
                        <el-form-item label="关联产品：" prop="checkName">
							{{ruleForm.relatedProducts}}
                        </el-form-item>
                        <el-form-item label="保质期：" prop="quality">
							{{ruleForm.quality}}
                            </el-input> 个月
                        </el-form-item>
                        <el-form-item label="电商链接：">
							{{ruleForm.link}}
                            </el-input>
                        </el-form-item>
                    </el-col>                
                </el-row>
            </div>
            <div class="container" style="margin-top:10px;">
                <el-row>
                    <el-col :span="22">
                        <el-form-item label="企业介绍：" prop="introduce">
                            <div v-html="ruleForm.introduce"></div>
                        </el-form-item>
                    </el-col>
                </el-row>
            </div>
            <el-form-item class="footerFixed" label-width="0px">
                <el-button @click="backPage">返回</el-button>
            </el-form-item>

        </el-form>
    </div>
</template>

<script>
import {basesource_findByAll,productDock_findById} from "@/request/api"
    import uploadImg from '../../../common/uploadImg';
    import E from 'wangeditor';
    export default {
        data(){
            return{
                basesourcelist:[],
                img:'',
                s:'',
                 radio:1,
                type:[
                    {name:1}
                ],
                imgurl:'',
                show:true,
                labelPosition:'right',
                ruleForm: {},
                listUrl:'',
                id:'',
                rules:{
                   
                }
            }
        },
        mounted(){
             this.id= this.$route.query.id
             // this.getbasesource()
          
                this.init()
            
         
        },
        methods:{
            init(){
				productDock_findById(this.id).then((res)=>{
					this.ruleForm = res.data
					this.img = this.$store.state.plantImg + this.ruleForm.img
					
				})
            },
       
            backPage () {
                this.$router.go(-1);
              
            },
        
      
            imgPreview(file,fileList) {
                this.img =  URL.createObjectURL(file.raw);
                let fileName = file.name;
                let regex = /(.jpg|.gif|.png|.jpeg)$/;
                if (regex.test(fileName.toLowerCase())) {
                    this.ruleForm.files = file.raw
                    this.ruleForm.img = file.name
                } else {
                    this.$message.error('请选择图片文件');
                }
            },   
        }
    }
</script>

<style scoped>
 .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    width:180px;
    overflow: hidden;
  }
  
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .el-upload--text{
      width:180px;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>